import React, {Component} from "react";
import { Link } from "react-router-dom";
import Table from "../../component/Table";
import Search from "../../component/Search";
import { formatTime } from "@/utils";

import { course_classList } from '@/api/userCenter';

class Index extends Component{

    state = {
        searchConfig: {
            columns: [
                {
                    type: 'Input',
                    name: 'curriculumName',
                    placeholder: '课题名称',
                },
                {
                    type: 'Select',
                    name: 'className',
                    placeholder: '班级名称',
                    options: []
                },
                {
                    type: 'Input',
                    name: 'teacherName',
                    placeholder: '授课教师',
                },
                {
                    type: 'RangePicker',
                    name: 'openClassTime',
                    range: ['startTime', 'endTime'],
                    placeholder: ["初始上课时间","结束上课时间"]
                }
            ]
        },
        tableConfig: {
            columns: [
                {
                    title: '#',
                    width: 60,
                    fixed: 'left',
                    render: (text, record, index) => {
                        const {current,pageSize} = this.state.tableConfig.pagination;
                        return (current-1) * pageSize + (index+1)
                    }
                },
                {
                    title: '课题名称',
                    ellipsis: true,
                    width: 150,
                    render: (text) => <Link to={{pathname: "/user/course_mg/lesson/"+text.curriculumId, state: {code: text.classCode}}}>{text.curriculumName}</Link>
                },
                {
                    title: '课时名称',
                    ellipsis: true,
                    dataIndex: 'classHourName',
                    width: 120
                },
                {
                    title: '课时',
                    width: 80,
                    render: (text) => text.orderNum+"/"+text.classHour
                },
                {
                    title: '课件数',
                    dataIndex: 'coursewareCount',
                    width: 80
                },
                {
                    title: '学校',
                    dataIndex: 'schoolName',
                    width: 120
                },
                {
                    title: '授课班级',
                    dataIndex: 'className',
                    width: 120
                },
                {
                    title: '授课人',
                    dataIndex: 'teacherName',
                    width: 80
                },
                {
                    title: '授课时间',
                    render: (text) => `${formatTime(text.startTime)}`,
                    width: 120
                }
            ],
            pagination: {
                current: 1,
                pageSize: 15
            },
            params: {
                paramsMap: {},
                sortName: "start_time",
                sortType: "desc"
            },
            request: {
                method: 'post',
                url: '/Classhour/getClassHourPage'
            }
        }
    };

    componentDidMount() {
        course_classList().then(res => {
            if(res.success){
                this.setState((state) => {
                    state['searchConfig']['columns'][1]['options'] = res.data.map(item => ({value: item.className, text: item.className}));
                    return {
                        ...state.searchConfig
                    }
                })
            }
        })
    }

    render() {
        return (
            <div className="table-list">
                <Search config={this.state.searchConfig} search={this.search} />
                <Table config={this.state.tableConfig} onRef={(ref) => this.table = ref } />
            </div>
        )
    }

    // 回调
    search = (searchConfig) => {
        const { tableConfig } = this.state;
        this.setState({
            tableConfig: {
                ...tableConfig,
                pagination: {
                    current: 1,
                    pageSize: 15
                }
            }
        }, () => {
            const { params, pagination } = this.state.tableConfig;
            this.table.getTableList({...params, paramsMap: {...searchConfig}}, pagination)
        })
    }
}

export default Index;